<template>
    <div id="register">
        <div class="login-top">
            <h2>新用户注册</h2>
        </div>
        <div class="login-form">
            <van-field v-model="user.username" center label="用户名" placeholder="请输入5-18位字母加数字" label-align="top" />
            <van-field v-model="user.password" center type="password" label="密码" placeholder="请输入密码" label-align="top" />
            <van-field v-model="user.password_confirmation" center type="password" label="确认密码" placeholder="请输入密码" label-align="top" />
            <van-field v-model="user.phone" type="number" center clearable label="手机号" placeholder="请输入手机号" label-align="top">
                <template #button>
                    <van-button size="small" type="success" plain @click="sendCode()">获取验证码</van-button>
                </template>
            </van-field>
            <van-field v-model="user.code" type="number" center label="短信验证码" placeholder="请输入验证码" label-align="top" />
            <div class="btn-1 btn-1-main mt50" @click="toRegister()">立即注册</div>
            <p class="register-tologin tc">已有账户 <a href="#/login" class="color-main">去登录</a></p>
        </div>
    </div>
</template>

<script>
import { showToast } from 'vant';
import { LOGIN } from '../.././store/mutation_types'
export default {
    name: 'Register',
    data() {
        return {
            user: {
                username: 'gameuser1',
                password: '123123',
                password_confirmation:'123123',
                phone:'18932813211',
                code:'301829',
            },
        }
    },
    created() { },
    methods: {
        sendCode(){
            let params = {'phone':this.user.phone};
            this.$api.code.send(params).then(res => {
                showToast({
                    message:'获取成功，尽快验证' + res.result
                });
            }).finally(e => {});
        },
        // 注册完成
        toRegister() {
            let params = this.user;
            params.auth_type = 1;
            params.openid = 'wxdfsa' + Math.random();
            this.$api.login.register(params).then(res => {
                // 保存token
                let userInfo = {
                    id:res.result.id,
                    name:res.result.username,
                    token:res.result.token,
                };
                this.$store.commit(LOGIN, userInfo);
                this.$router.push('/cert');
            }).finally(e => {});
        }
    }
}
</script>
